<%--
  Created by IntelliJ IDEA.
  User: Boss
  Date: 2021/5/8
  Time: 9:51
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>用户借书</title>
</head>
<link rel="stylesheet" type="text/css" href="layui/css/layui.css">
<body>
<%
    String path=request.getContextPath();
    String basePath=request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<div>
    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 50px;">
        <legend>用户借书</legend>
    </fieldset>
    <form action="<%=basePath%>BorrowServlet?opr=insert" method="post">
        <div class="layui-form-item">
            <label class="layui-form-label">读者卡号</label>
            <div class="layui-input-block">
                <input type="text" name="cardId" required  lay-verify="required" placeholder="请输入读者卡号" autocomplete="off" class="layui-input jCardId">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">书籍编号</label>
            <div class="layui-input-block">
                <input type="text" name="bookId" required  lay-verify="required" placeholder="请输入书籍编号" autocomplete="off" class="layui-input jBookId">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">借阅时间</label>
            <div class="layui-input-block">
                <input type="text" name="startTime" required  lay-verify="required" placeholder="请输入借阅时间" autocomplete="off" class="layui-input jStartTime">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">约定天数</label>
            <div class="layui-input-block">
                <input type="text" name="day" required  lay-verify="required" placeholder="请输入约定天数" autocomplete="off" class="layui-input jDay">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">联系电话</label>
            <div class="layui-input-block">
                <input type="text" name="phone" required  lay-verify="required" placeholder="请输入联系电话" autocomplete="off" class="layui-input jPhone">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="button" name="BeOverdue" class="layui-btn" lay-submit lay-filter="formDemo" value="确认借书">
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                <%--                        <input type="button" name="bt" value="确认借书" class="layui-btn">--%>
            </div>
        </div>
    </form>
</div>
<script src="layui/layui.js"></script>
<script src="js/jquery-1.12.4.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        /**
         * 确认借书
         * */
        $("input[name='BeOverdue']").click(function () {
            let cardId = $(".jCardId").val();
            let bookId = $(".jBookId").val();
            let startTime = $(".jStartTime").val();
            let day = $(".jDay").val();
            let phone = $(".jPhone").val();
            $.ajax({
                url: "BorrowServlet?opr=insert",
                type: "post",
                data: {
                    cardId: cardId,
                    bookId: bookId,
                    startTime: startTime,
                    day: day,
                    phone: phone
                },
                dateType: "json",
                success: function (date) {
                    if (date) {
                        layer.open({
                            content: '借书成功！',
                            success: function (layero, index) {
                                console.log(layero, index);
                            }
                        });
                    } else {
                        layer.open({
                            content: '借书失败！',
                            success: function (layero, index) {
                                console.log(layero, index);
                            }
                        });
                    }
                }
            })
        })
    })
</script>
</body>
</html>
